<#--
/****************************************************
 * Description: 用户登陆、注册页面
 * Copyright:   Copyright (c) 2013
 * Company:     beiwaionline
 * @author      qiaowenbin
 * @version     0.0.1.20140627
 * @see
	HISTORY
    *  2016-01-21 wangzhuquan create
**************************************************/
-->
<#include "/view/templates/ace/ace-inc.ftl">
<@html>
<@head import=true>
<script src="${base}/js/jquery.cookie.js"></script>
</@head>
<@body class="login-layout">
		<div class="main-container">
			<div class="main-content">
				<div class="row">
					<div class="col-sm-10 col-sm-offset-1">
						<div class="login-container">
							<div class="center">
								<h1>
									<i class="ace-icon fa fa-leaf green"></i>
									<span class="red">屹航物流</span>
									<span class="white" id="id-text2">车辆管理系统</span>
								</h1>
								<h4 class="blue" id="id-company-text">&copy;Company Online</h4>
							</div>

							<div class="space-32"></div>
							<div class="space-32"></div>

							<div class="position-relative">
								<div id="login-box" class="login-box visible widget-box no-border">
									<div class="widget-body">
										<div class="widget-main">
											<h4 class="header blue lighter bigger">
												<i class="ace-icon fa fa-coffee green"></i>
												请输入信息
											</h4>

											<div class="space-6"></div>

											<form class="form-horizontal form-signin" role="form" action="${base}/login/logon" onsubmit="submitForm();">
												<fieldset>
													<label class="block clearfix">
														<span class="block input-icon input-icon-right">
															<input type="text" name="loginname" class="form-control" placeholder="用户名" />
															<i class="ace-icon fa fa-user"></i>
														</span>
													</label>

													<label class="block clearfix">
														<span class="block input-icon input-icon-right">
															<input type="password" name="password"  class="form-control" placeholder="密码" />
															<i class="ace-icon fa fa-lock"></i>
														</span>
													</label>

													<div class="space"></div>
													
													<div class="clearfix">
														<label class="inline">
															<input type="checkbox" class="ace" id="rememberMe" />
															<span class="lbl"> 七天内记住我</span>
														</label>

														<button type="submit" class="width-35 pull-right btn btn-sm btn-primary">
															<i class="ace-icon fa fa-key"></i>
															<span class="bigger-110">登录</span>
														</button>
													</div>

													<div class="space-4"></div>
												</fieldset>
											</form>
												<#if loginErrInfo?exists>
													<div class="social-or-login center">
															<h4 class="red lighter bigger-110">${loginErrInfo}</h4>
													</div>
												</#if>
											</div>
											<#--<div class="social-or-login center">
												<span class="bigger-110">Or Login Using</span>
											</div>

											<div class="space-6"></div>

											<div class="social-login center">
												<a class="btn btn-primary">
													<i class="ace-icon fa fa-facebook"></i>
												</a>

												<a class="btn btn-info">
													<i class="ace-icon fa fa-twitter"></i>
												</a>

												<a class="btn btn-danger">
													<i class="ace-icon fa fa-google-plus"></i>
												</a>
											</div>-->
										</div><!-- /.widget-main -->
										
									</div><!-- /.widget-body -->
								</div><!-- /.login-box -->


							</div><!-- /.position-relative -->

							<div class="navbar-fixed-top align-right">
								<br />
								&nbsp;
								<a id="btn-login-dark" href="#">Dark</a>
								&nbsp;
								<span class="blue">/</span>
								&nbsp;
								<a id="btn-login-blur" href="#">Blur</a>
								&nbsp;
								<span class="blue">/</span>
								&nbsp;
								<a id="btn-login-light" href="#">Light</a>
								&nbsp; &nbsp; &nbsp;
							</div>
						</div>
					</div><!-- /.col -->
				</div><!-- /.row -->
			</div><!-- /.main-content -->
		</div><!-- /.main-container -->
		
		<!--[if !IE]> -->
		<script type="text/javascript">
			window.jQuery || document.write("<script src='../assets/js/jquery.js'>"+"<"+"/script>");
		</script>

		<!-- <![endif]-->

		<!--[if IE]>
		<script type="text/javascript">
		 window.jQuery || document.write("<script src='../assets/js/jquery1x.js'>"+"<"+"/script>");
		</script>
		<![endif]-->
<script type="text/javascript">
	if('ontouchstart' in document.documentElement) document.write("<script src='../assets/js/jquery.mobile.custom.js'>"+"<"+"/script>");
</script>

<!-- inline scripts related to this page -->
<script type="text/javascript">
	jQuery(function($) {
	 $(document).on('click', '.toolbar a[data-target]', function(e) {
		e.preventDefault();
		var target = $(this).data('target');
		$('.widget-box.visible').removeClass('visible');//hide others
		$(target).addClass('visible');//show target
	 });
	});
	
	
	
	//you don't need this, just used for changing background
	jQuery(function($) {
	 $('#btn-login-dark').on('click', function(e) {
		$('body').attr('class', 'login-layout');
		$('#id-text2').attr('class', 'white');
		$('#id-company-text').attr('class', 'blue');
		
		e.preventDefault();
	 });
	 $('#btn-login-light').on('click', function(e) {
		$('body').attr('class', 'login-layout light-login');
		$('#id-text2').attr('class', 'grey');
		$('#id-company-text').attr('class', 'blue');
		
		e.preventDefault();
	 });
	 $('#btn-login-blur').on('click', function(e) {
		$('body').attr('class', 'login-layout blur-login');
		$('#id-text2').attr('class', 'white');
		$('#id-company-text').attr('class', 'light-blue');
		
		e.preventDefault();
	 });
	 
	});
	function initCookie(){
		var rememberMe=$.cookie('rememberMe');
		var loginname=$.cookie('loginname');
		var password=$.cookie('password');
		if(loginname){$("[name=loginname]").val(loginname);}
		if(password){$("[name=password]").val(password);}
		if(rememberMe){$('#rememberMe').attr('checked','checked');}
		
	}
	
	function submitForm(){
		var isChecked=$('#rememberMe').is(':checked');
		if(isChecked){
			$.cookie('rememberMe', true, { expires: 7 });
			$.cookie('loginname', $('[name=loginname]').val(), { expires: 7 });
			$.cookie('password', $('[name=password]').val(), { expires: 7 });
		}else{
			$.cookie('loginname', "", { expires: -1 });
			$.cookie('password', "", { expires:-1 });
			$.cookie('rememberMe', "", { expires: -1 });
		}
	}
	initCookie();
</script>
</@body>
</@html>

